<template>
  <a-card :bordered="false">
    <div class="table-page-search-wrapper">
      <a-form layout="inline" >
        <a-row :gutter="48">
          <a-col :md="8" :sm="24">
            <a-form-item label="用户账号">
              <a-input v-model="searchParam.username" placeholder=""/>
            </a-form-item>
          </a-col>
          <a-col :md="8" :sm="24">
            <a-form-item label="用户姓名">
              <a-input v-model="searchParam.nickName" placeholder=""/>
            </a-form-item>
          </a-col>
          <template v-if="advanced">
          </template>
          <a-col :md="!advanced && 8 || 24" :sm="24">
            <span class="table-page-search-submitButtons"
                  :style="advanced && { float: 'right', overflow: 'hidden' } || {} ">
              <a-button type="primary" @click="search">查询</a-button>
              <a-button style="margin-left: 8px" @click="reset">重置</a-button>
<!--              <a @click="toggleAdvanced" style="margin-left: 8px">-->
<!--                {{ advanced ? '收起' : '展开' }}-->
<!--                <a-icon :type="advanced ? 'up' : 'down'"/>-->
<!--              </a>-->
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>

    <div class="table-operator">
      <a-button type="primary" icon="plus" @click="$refs.save.add()">新建</a-button>
      <a-dropdown  v-if="selectedRowKeys.length > 0">
        <a-menu slot="overlay"  @click="handleMenuClick">
          <a-menu-item key="delete">
            <a-icon type="delete"/>
            删除
          </a-menu-item>
        </a-menu>
        <a-button style="margin-left: 8px">
          批量操作
          <a-icon type="down"/>
        </a-button>
      </a-dropdown>
    </div>

    <a-table
      :rowKey=" (record => record.id)"
      :dataSource="tableData"
      :pagination="pagination"
      :loading="loading"
      :rowSelection="rowSelection"
    >
      <a-table-column title="用户账号" dataIndex="username" key="username"/>
      <a-table-column title="密码" dataIndex="password" key="password"/>
      <a-table-column title="用户姓名" dataIndex="nickName" key="nickName"/>

      <a-table-column title="角色" dataIndex="roles" key="roles">
        <template slot-scope="roles">
            <template v-if="roles">
              <a-tag color="#108ee9" v-for="role in roles" :key="role.id">{{role.roleName}}</a-tag>
            </template>
        </template>
      </a-table-column>
      <a-table-column title="上一次登录时间" dataIndex="lastLoginTime" key="lastLoginTime"/>
      <a-table-column title="操作">
        <template slot-scope="record">
        <span>
          <a href="javascript:;" @click="handleEdit(record)">编辑</a>
          <a-divider type="vertical"/>
            <a-popconfirm title="确定删除吗？" @confirm="handleDelete(record)">
                 <a-icon slot="icon" type="question-circle-o" style="color: red"/>
                <a href="javascript:;">删除</a>
             </a-popconfirm>
        </span>
        </template>
      </a-table-column>
    </a-table>

    <save ref="save" @refresh="refresh"></save>
  </a-card>
</template>


<script>
  import save from './save/save'
  import curdMixins from '../../../common/mixins/curdMixins'
  import { selectPage,deleteByIds,deleteById } from '../../../api/base/admin'

  export default {
    name: 'admin',
    mixins: [curdMixins],
    components: {
      save
    },
    data(){
      return{
         multiOperator:[
           {
             key: "delete",
             method: deleteByIds,
             msg:"批量删除成功",
             tip:"确定批量删除吗？"
           }
         ]
      }
    },
    methods: {
      getList(param) {
        return selectPage(param)
      },
      delete(param){
        return deleteById(param)
      }
    }
  }
</script>

<style scoped>

</style>